<template>
  <div class="dashboard-container" align="center">
    <el-row :gutter="20">
        <el-card class="box-card" style="padding-bottom: 1rem">
          <div slot="header" class="clearfix">
            <span>个人信息</span>
          </div>
          <div class="text item">姓名: {{ trueName }}</div>
          <div class="text item">{{ roleId === '001' ? "学号" : "教职工号" }}: {{ userNumber }}</div>
          <div class="text item">手机号码: {{ telephone }}</div>
          <div class="text item">QQ: {{ oicq }}</div>
          <div class="text item">邮箱: {{ mail }}</div>
          <div class="text item" v-if="roleId==='002'">工作地点: {{ address }}</div>
          <div class="text item">用户名: {{ loginName }}</div>
        </el-card>
    </el-row>


  </div>
</template>

<script>
import $ from "@/api/sysuser";

export default {
  data() {
    return {
      /**
       * 内容数据
       */
      loginName: "",
      countPartner: "",
      trueName: "",
      telephone: "",
      dingDing: "",
      depName: "",
      depId: "",
      roleId: "",
      userNumber: "",
      oicq: "",
      mail: "",
      address: "",
      alarmList: [],
    };
  },
  mounted() {
    $.findFromUserID().then(response => {
      if (response.success) {
        this.trueName = response.data.trueName;
        this.telephone = response.data.telephone;
        this.loginName = response.data.loginName;
        this.roleId = response.data.roleId;
        this.userNumber = response.data.userNumber
        this.oicq = response.data.oicq
        this.mail = response.data.mail
        this.address = response.data.address
      }
    });
  },
  methods: {


  }
};
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }

  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}

.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.box-card {
  width: 100%;
}
</style>
